// import { createStore, combineReducers, applyMiddleware } from 'redux'
import { createStore, combineReducers, applyMiddleware } from './myredux'
// import thunk from 'redux-thunk'
// thunk 中间件的作用就是让我们的redux的dispatch接收函数作为action了
// console.log(applyMiddleware)
function thunk(store) {
  console.log('store', store)
  let { dispatch, getState } = store
  return function (next) {
    // next 起始是dispatch
    console.log('next', next)
    return function createdDispatchByThunk(action) {

      if (typeof action == 'function') {
        return action(dispatch, getState)
      }
      return next(action)
    }
  }
}
let qqq = store => next => action => {
  console.log("qqq");
  action.qqq = 888
  return next(action)
}
let www = store => next => action => {
  console.log('www');
  action.qqq = 666
  return next(action)
}
function reducer(state, action) {
  console.log(action)
  state = state || {
    count: 100,
    name: "珠峰"
  }
  switch (action.type) {
    case 'add':
      return {
        ...state,
        count: state.count + action.n
      }

    default:
      return {
        ...state
      }
  }
}
function colorReducer(state, action) {

  // console.log('color的 reducer执行了')
  state = state || {
    color: "red"
  }
  switch (action.type) {
    case 'changeColor':
      return {
        ...state,
        color: action.col
      }
    default:
      return {
        ...state
      }
  }
}

let rootReducer = combineReducers({
  QQQ: reducer,
  WWW: colorReducer
})
// console.log(rootReducer)
let store = createStore(rootReducer, applyMiddleware(thunk, qqq, www))
// applyMiddleware(thunk, qqq) 是吧默认的dispatch换成了 qqq产上的哪个 dispatch了
// 当 调用dispatch的时候执行的是 qqq产生的dispatch  这个dispatch执行的时候 会调用他的next执行
//  他的next对应的就是 thunk产生的哪个dispatch 最终的返回结果其实是 thunk的dispatch的返回结果
/* 
  store : {getState,dispatch,subscribe}

*/
export default store